import { h, defineAsyncComponent } from 'vue'
import { ElMessageBox, ElMessageBoxOptions, MessageBoxData } from 'element-plus';

const VpLabel = defineAsyncComponent(() => import('/@/components/vp/label/VpLabel.vue'));

/**
 * 确认消息框
 * @param message 提示消息
 * @param title 提示标题
 * @param options 额外选项
 * @returns 确认消息框
 */
const confirm = (message: {zh: string, en: string}, title: {zh: string, en: string}, options: ElMessageBoxOptions): Promise<MessageBoxData> => {
	return ElMessageBox.confirm(
		h(VpLabel, {zh:message.zh, en:message.en}), 
		(title.zh || '') + '\r\n' + (title.en || ''), 
		{
			confirmButtonText: '确定\r\nConfirm',
			cancelButtonText: '取消\r\nCancel',
			customClass: 'vp-message-box',
			...options
		}
	);
}

export default {

	/**
	 * 确认消息框
	 * @param message 提示消息
	 * @param title 提示标题
	 * @param options 配置项（参照ElMessageBox）
	 * @returns 确认消息框
	 */
	confirm: confirm,

	/**
	 * 确认删除消息框
	 * @param options 配置项（参照ElMessageBox）
	 * @returns 
	 */
	confirmDelete: (options?: ElMessageBoxOptions): Promise<MessageBoxData> => {
		return confirm({
			zh: '此操作将永久删除, 是否继续？',
			en: 'This operation will permanently delete. Do you want to continue?',
		}, {
			zh: '提示',
			en: 'Info',
		}, {
			type: 'warning',
			...options,
		});
	},

	/**
	 * 确认作废消息框
	 * @param options 配置项（参照ElMessageBox）
	 * @returns 
	 */
	confirmDiscard: (options?: ElMessageBoxOptions): Promise<MessageBoxData> => {
		return confirm({
			zh: '是否确定作废此数据？',
			en: 'Whether to Confirm Voiding This Data?',
		}, {
			zh: '提示',
			en: 'Info',
		}, {
			type: 'warning',
			...options,
		});
	},


	/**
	 * 确认操作消息框
	 * @param options 配置项（参照ElMessageBox）
	 * @returns 
	 */
	confirmOperation: (options?: ElMessageBoxOptions): Promise<MessageBoxData> => {
		return confirm({
			zh: '是否确定进行此操作？',
			en: 'Are you sure to perform this operation?',
		}, {
			zh: '提示',
			en: 'Info',
		}, {
			type: 'warning',
			...options,
		});
	}
} 